<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>首页</title>
	</head>
	<body>
		<input  id="debounce" type="" value="" />
		<div id="app">
			  <h1 v-bind:class="{active:isActive,'text-danger':isActive}">Hello App!</h1>
			  <h1 v-bind:class="[activeClass,{'text-danger':isActive}]">Hello App!</h1>
			  <h1 v-bind:style="{fontSize:'100px',color:'red'}">Hello App!</h1>
			  <h1 v-bind:style="styleObject">Hello App!</h1>
			  <h1 v-bind:style="[styleObject,styleObject1]">Hello App!</h1>
			  <p>
			    <!-- 使用 router-link 组件来导航. -->
			    <!-- 通过传入 `to` 属性指定链接. -->
			    <!-- <router-link> 默认会被渲染成一个 `<a>` 标签 -->
			    <router-link to="/a">A组件</router-link>
			    <router-link to="/b">B组件</router-link>
			    <router-link to="/user/foo">User组件</router-link>
			  </p>
			  <!-- 路由出口 -->
			  <!-- 路由匹配到的组件将渲染在这里 -->
			  <router-view></router-view>
		</div>
	</body>
</html>
